<include file="Weixin/header" />
<title>设置密码</title>
</head>
<body class="clearfix key">
    <div class="jl"><a href="ucenter.html?func=openlog" class="fontap">开门记录</a></div>
    <div class="main">
        <img src="__PUBLIC__/weixin/images/suo.png">
        <div class="zt">
            <div class="rond open"></div> <br>
            门开启
        </div>
    </div>
    <div class="tag">请输入8位数开锁密码！</div>
    <div class="inputs">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
        <input type="text" maxlength="1">
    </div>
    <div class="btns">
        <ul>
            <li class="crd"><img src="__PUBLIC__/weixin/images/car.png"> <br> 设置开门卡</li>
            <li class="psw"><img src="__PUBLIC__/weixin/images/mim.png"><br> 设置开门密码</li>
        </ul>
    </div>

    <div class="dlgbg hide" id="msgbox">
        <div class="msgbox">
            <div class="text">
                <img src="__PUBLIC__/weixin/images/tsicon.png"> <br>
                请将开门卡放在锁上，10秒后听到“提示音”即设置成功！
                <div class="cld"><img src="__PUBLIC__/weixin/images/cc.png" ></div>
            </div>
        </div>
    </div>
    
    <div class="dlgbg hide" id="setpsw">
        <div class="msgbox">
            <div class="set">
                <input type="text" placeholder="请输入开锁密码">
                <input type="text" placeholder="重复密码">
            </div>
            <div class="btns">
                <ul>
                    <li class="cll">取 消</li>
                    <li class="fontblue rea">确 定</li>
                </ul>
            </div>
        </div>
    </div>
    
    <script>
        $(document).ready(function() {
           var txts = $(".inputs").children("input");
           for(var i=0; i<txts.length; i++){
               var t =txts[i];
               t.index = i ;
              // t.setAttribute("readonly", true);
              t.onkeyup= function(event){
                    if(event.keyCode == "8"){
                    $("input").val("");
                   // t.setAttribute("readonly", true);
                    //txts[0].removeAttribute("readonly");
                    txts[0].focus();
                    return;
                    }
                }

               t.onkeypress = function(){
                this.value=this.value.replace(/^(.).*$/,'$1'); 
                var next = this.index + 1; 
                if(next > txts.length - 1) return; 
               // txts[next].removeAttribute("readonly"); 
                txts[next].focus();
                
               
               }
           }
          // txts[0].removeAttribute("readonly");
             

           $(".crd").on("touchend",function(){
              $("#msgbox").show();
           })

           $(".psw").on("touchend",function(){
              $("#setpsw").show();
           })

           $(".cld").on("touchend",function(e){
            $("#msgbox").hide();
            e.preventDefault();
           })

           $(".cll,.rea").on("touchend",function(){
              $("#setpsw").hide();
           })
 
        });
    </script>
</body>
</html>